<div class="row">
    <div class="col">
        <div class="card">
            <div class="card-title px-3 pt-3">新增评论</div>
            <div class="card-subtitle px-3">添加评论信息</div>
            <div class="card-body">
                <form class="form-material" enctype="multipart/form-data">
                    <div class="form-group">
                        <label>评论人编号：</label>
                        <input type="number" name="u_id" class="form-control">
                    </div>

                    <div class="form-group">
                        <label>商品编号：</label>
                        <input type="number" name="p_id" class="form-control">
                    </div>

                    <div class="form-group">
                        <label>评论内容：</label>
                        <textarea cols="50" rows="10" name="content" class="form-control">在这里输入评论内容...</textarea>
                    </div>
                    <div>
                        <button class="btn btn-primary"><i class="fa fa-save"></i> 保存</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    $(function () {
        // 为所有 type="file" 的 input，设置预览
        $(":file").change(function () {
            var targetName = $(this).data("img");

            //使用这个方法来临时创建一个文件的链接，参数是一个file或者blob
            var path = URL.createObjectURL(this.files[0]);

            //将链接赋值给上面的图片src路径
            $(targetName).prop("src", path)
        });

        $("form").submit(function () {
            var data = new FormData(this);  // 传递的数据

            $.ajax({
                url: "http://localhost:8080/comment",
                data: data,
                type: "POST",
                processData: false,
                contentType: false,
                success: function (dto) {
                    //如果成功
                    if (dto.code == 1000) {
                        swal({
                            title: "评论成功",
                            type: "success",
                            confirmButtonText: "确定"
                        })
                    } else {
                        swal({
                            title: "评论失败",
                            text: dto.msg,
                            type: "error",
                            confirmButtonText: "确定"
                        })
                    }
                }
            });

            return false;
        });
    });
</script>